<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>我的荷花数</title>
		<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0' />
		<link rel="stylesheet" href="css/lotuCounts.css" />
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="js/moduls/islogin.js" ></script>
		<script src="js/moduls/alliance.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="js/adapter.js"></script>
		<script type="text/javascript" src="js/moduls/LotusRec.js" ></script>
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
	</head>

	<body>
		<div class="content">
			<div class="logo">
				<img src="img/logo.png" />
			</div>
			<div class="theme">
				<img src="img/theme.png" />
			</div>
			<div class="subTop">
				<div class="picture">
					<img src="img/title2.png" />
				</div>

			</div>

			<div class="middlePath">
				<div class="title">
					<img src="img/lotuAccount.png" alt="">
				</div>
				<div class="line">
					<img src="img/line.png" alt="">
				</div>
				<div class="midContent">
					<div class="lotuNum">
						<span>荷花数： </span><span class="place">{{lotusNum}}</span>
					</div>

				</div>
				<div class="line">
					<img src="img/line.png" alt="">
				</div>
				<div class="tableContent">
					<div class="innerTab">
						<table style="border-collapse:collapse">
							<thead>
								<tr>
									<td style="width: 1.8rem;">项目</td>
									<td style="width: 1.5rem;">数量</td>
									<td style="width: 1.9rem;">时间</td>
								</tr>
							</thead>
							
						</table>
					</div>
					<div class="innerTab2">
						<table style="border-collapse:collapse">
							<tbody>
								<tr v-for="lotuNum in lotusRecs" :key="lotuNum.id">
									<td style="width: 1.8rem;">{{lotuNum.key}}</td>
									<td style="width: 1.5rem;">{{lotuNum.count}}</td>
									<td style="width: 1.9rem;">{{lotuNum.createdAt}}</td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
				<div class="page">
					<!--<span>页码</span>
					<span>1</span>
					<span>2</span>
					<span>3</span>-->
				</div>

			</div>
			<!--<div class="backBtn" @click="backCenter()">返回</div>-->
			<div class="backBtn">
				<a href="javascript:history.go(-1)">返回</a>
			</div>

			<div class="bottom-logo">
				<img src="img/bottom_logo.png" />
			</div>
		</div>

		<script type="text/javascript">
			var app = new Vue({
				el: '.content',
				data: {
					lotusRecs: [],
					lotusNum:""
				}
			})

			
			getMyLotusRec(t_skey,function(res){
				for(var i = 0; i < res.lotusRec.length % 8; i++) {
					var t_team = {
						"key": "",
						"count": "",
						"createdAt" :""
					}
					res.lotusRec.push(t_team)
				}
				app.lotusRecs= res["lotusRec"];
				app.lotusNum = res["lotusNum"];
			})
		</script>

	</body>

</html>